{
  "config": {
    "brand": {
      "hue": {
        "name": "hue",
        "$value": "336",
        "comment": "Base hue of the brand. Colors are calculated based on this value."
      }
    }
  },
  "color": {
    "text": {
      "light": {
        "1": {
          "name": "light-1",
          "$value": "hsl(var(--config-brand-hue) 0% 8%)"
        },
        "2": {
          "name": "light-2",
          "$value": "hsl(var(--config-brand-hue) 3% 24%)"
        }
      },
      "dark": {
        "1": {
          "name": "dark-1",
          "$value": "hsl(var(--config-brand-hue) 96% 98%)"
        },
        "2": {
          "name": "dark-2",
          "$value": "hsl(var(--config-brand-hue) 4% 88%)"
        }
      }
    },
    "surface": {
      "light": {
        "1": {
          "name": "light-1",
          "$value": "hsl(var(--config-brand-hue) 0% 97%)"
        },
        "2": {
          "name": "light-2",
          "$value": "hsl(var(--config-brand-hue) 16% 92%)"
        }
      },
      "dark": {
        "1": {
          "name": "dark-1",
          "$value": "hsl(var(--config-brand-hue) 6% 1%)"
        },
        "2": {
          "name": "dark-2",
          "$value": "hsl(var(--config-brand-hue) 96% 12%)"
        }
      }
    },
    "brand": {
      "light": {
        "1": {
          "name": "light-1",
          "$value": "hsl(var(--config-brand-hue) 100% 48%)"
        },
        "2": {
          "name": "light-2",
          "$value": "hsl(var(--config-brand-hue) 100% 24%)"
        }
      },
      "dark": {
        "1": {
          "name": "dark-1",
          "$value": "hsl(var(--config-brand-hue) 100% 48%)"
        },
        "2": {
          "name": "dark-2",
          "$value": "hsl(var(--config-brand-hue) 100% 72%)"
        }
      }
    },
    "code": {
      "light": {
        "background": {
          "name": "light-background",
          "$value": "hsl(var(--config-brand-hue) 20% 99%)"
        },
        "keyword": {
          "name": "light-keyword",
          "$value": "hsl(calc(var(--config-brand-hue) + 60) 100% 48%)"
        },
        "string": {
          "name": "light-string",
          "$value": "hsl(calc(var(--config-brand-hue) + 280) 100% 48%)"
        },
        "punctuation": {
          "name": "light-punctuation",
          "$value": "var(--color-brand-light-1)"
        },
        "operator": {
          "name": "light-operator",
          "$value": "hsl(calc(var(--config-brand-hue) + 230) 100% 48%)"
        },
        "tag": {
          "name": "light-tag",
          "$value": "var(--color-brand-light-2)"
        },
        "plain": {
          "name": "light-plain",
          "$value": "var(--color-text-light-1)"
        }
      },
      "dark": {
        "background": {
          "name": "dark-background",
          "$value": "hsl(var(--config-brand-hue) 16% 5%)"
        },
        "keyword": {
          "name": "dark-keyword",
          "$value": "hsl(calc(var(--config-brand-hue) + 60) 100% 64%)"
        },
        "string": {
          "name": "dark-string",
          "$value": "hsl(calc(var(--config-brand-hue) + 280) 100% 64%)"
        },
        "punctuation": {
          "name": "dark-punctuation",
          "$value": "var(--color-brand-dark-1)"
        },
        "operator": {
          "name": "dark-operator",
          "$value": "hsl(calc(var(--config-brand-hue) + 230) 100% 64%)"
        },
        "tag": {
          "name": "dark-tag",
          "$value": "var(--color-brand-light-2)"
        },
        "plain": {
          "name": "dark-plain",
          "$value": "var(--color-text-dark-1)"
        }
      }
    },
    "status": {
        "error": {
          "name": "error",
          "$value": "hsl(12 100% 48%)"
      }
    }
  }
}